<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="copyright" content="All Rights Reserved, Copyright (C) 2013, Wuyeguo, Ltd." />
<title>EasyUI Web Admin Power by Wuyeguo</title>
<link rel="stylesheet" type="text/css" href="../easyui/1.3.4/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="../css/wu.css" />
<link rel="stylesheet" type="text/css" href="../css/icon.css" />
<script type="text/javascript" src="../js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../js/jquery.serializejson.min.js"></script>
<script type="text/javascript" src="../easyui/1.3.4/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../easyui/1.3.4/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="../js/jquery.parseurl.min.js"></script>
</head>
<body class="easyui-layout">
<div class="easyui-layout" data-options="fit:true">
    <div data-options="region:'west',border:true,split:true," title="评论管理" style="width:150px; padding:5px;">
        <ul id="tt"></ul>
    </div>
    <!-- Begin of toolbar -->
    <div id="zong" data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">
        <div id="wu-toolbar-2">
            <div class="comment-toolbar-button">
                <a href="#" class="easyui-linkbutton" iconCls="icon-add" onclick="openAdd()" plain="true">添加</a>
                <a href="#" class="easyui-linkbutton" iconCls="icon-edit" onclick="openEdit()" plain="true">修改</a>
                <a href="#" class="easyui-linkbutton" iconCls="icon-remove" onclick="remove()" plain="true">删除</a>
                <a href="#" class="easyui-linkbutton" iconCls="icon-reload" onclick="reload()" plain="true">刷新</a>
            </div>
            <div class="comment-toolbar-search">
                <label>起始时间：</label><input class="easyui-datebox" style="width:100px">
                <label>结束时间：</label><input class="easyui-datebox" style="width:100px">
                <label>用户组：</label>
                <select class="easyui-combobox" panelHeight="auto" style="width:100px">
                    <option value="0">选择用户组</option>
                    <option value="1">黄钻</option>
                    <option value="2">红钻</option>
                    <option value="3">蓝钻</option>
                </select>
                <label for="sear">关键词：</label><input id="sear" class="wu-text" style="width:100px">
                <a href="#" class="easyui-linkbutton" id="sousuo" iconCls="icon-search">开始检索</a>
            </div>
        </div>
        <table id="comment-datagrid-2" class="easyui-datagrid" toolbar="#wu-toolbar-2"></table>
    </div>
    <!-- End of toolbar -->
    
</div>
<!-- Begin of easyui-dialog -->
<div id="comment-dialog-2" class="easyui-dialog" data-options="closed:true,iconCls:'icon-save'" style="width:400px; padding:10px;">
    <form id="comment-form-2" method="post">
        <table>
            <tr>
                <td width="60" align="right">发布者:</td>
                <td><input type="text" name="name" class="wu-text wu-text0" /></td>
            </tr>
            <tr>
                <td align="right">点赞数:</td>
                <td><input type="text" name="thump" class="wu-text wu-text1" /></td>
            </tr>
            <tr>
                <td valign="top" align="right">内 容:</td>
                <td><textarea name="content" rows="6" class="wu-textarea wu-text2" style="width:260px"></textarea></td>
            </tr>
        </table>
    </form>
</div>
<!-- End of easyui-dialog -->
<script type="text/javascript">

    $('#tt').tree({//加载树形菜单
        animate:true,
        url:'http://localhost:3000/cate/list',
        method:'get'
    })


    /**
    * Name 载入数据
    */
    function load(){
        $.ajax({
            url:'http://localhost:3000/comment/all',
            type:'post'
        }).then(function(res){
            var id=$.parseUrl(window.location.href).query.id;
            var data={};//这里是模拟一个json数据，用于传输渲染
            data.total=0;
            data.rows=[];
            for(var i=0;i<res.length;i++){
                if(res[i].newsId==id){
                    data.total++;
                    data.rows.push(res[i]);
                }
            }
            // console.log(JSON.parse(JSON.stringify(data)))
            data=JSON.parse(JSON.stringify(data));
            $('#comment-datagrid-2').datagrid({
                data:data.rows,
                pagination:true,
                fitColumns:true,
                fit:true,
                columns:[[
                    { checkbox:true},
                    { field:'name',title:'发布者',width:120,sortable:true},
                    { field:'thump',title:'点赞数',width:120,sortable:true},
                    { field:'content',title:'内容',width:180},
                    { field:'date',title:'发布时间',width:270},
                    {field:'operate',title:'管理', width:00,
                        formatter: function(value,row,index){
                            return '<a href="javascript:void(0)" class="easyui-linkbutton editcls"  onclick="editUser(\''+ row._id+'\')">编辑</a>'+
                        '<a href="javascript:void(0)" class="easyui-linkbutton remove" onclick="deleUser(\''+ row._id+'\')">删除</a>'
                        }
                    }
                ]],
                onLoadSuccess:function(data){  
                    $('.editcls').linkbutton({text:'编辑',plain:true,iconCls:'icon-edit'});
                    $('.remove').linkbutton({text:'删除',plain:true,iconCls:'icon-remove'});
                }
            });
        })
    }
    load();




    //搜索框
    var bstop=true;
    $('#sousuo').on('click',function(){
        var id=$('#sear').val();
        bstop=true;
        $.ajax({
            type:"post",
            url:"http://localhost:3000/comment/all"
        }).then(function(res){
            var sum=0;
            var yi;
            for(var i=0;i<res.length;i++){
                if(res[i].name==id || res[i].thump==id || res[i].content==id){
                    yi=i+1;
                    sum++;
                    $('#comment-dialog-2').dialog({
                        closed: false,
                        modal:true,
                        title: "信 息",
                        buttons: [{
                            text: '确定',
                            iconCls: 'icon-ok',
                            handler: function () {
                                $('#comment-dialog-2').dialog('close');
                            }
                        }, {
                            text: '取消',
                            iconCls: 'icon-cancel',
                            handler: function () {
                                $('#comment-dialog-2').dialog('close');
                            }
                        }]
                    });
                    $(".wu-text0").val(res[i].name);
                    $(".wu-text1").val(res[i].thump);
                    $(".wu-text2").val(res[i].content);
                    bstop=false;
                }
            }
            if(sum>0){
                alert('一共找到'+sum+'条记录，您要找的数据在第'+yi+'行！');
            }
            if(bstop){
                alert('不在查询范围！搜索关键字：发布者、点赞数、内容。');
                bstop=false;
            }
        })
    })



    /**
    * Name 添加记录
    */
    function openAdd(){
        $('#comment-form-2').form('clear');
        $('#comment-dialog-2').dialog({
            closed: false,
            modal:true,
            title: "添加信息",
            buttons: [{
                text: '确定',
                iconCls: 'icon-ok',
                handler: add
            }, {
                text: '取消',
                iconCls: 'icon-cancel',
                handler: function () {
                    $('#comment-dialog-2').dialog('close');
                }
            }]
        });
    }
    function add(){
        var id=$.parseUrl(window.location.href).query.id;
        var formData = $('#comment-form-2').serializeJSON();
        formData.newsId=id;
        $.ajax({
            type:"post",
            url:"http://localhost:3000/comment/data",
            data: formData
        }).then(function(res){
            if(res){
                $.messager.alert('信息提示','提交成功！','info');
                load();
                $('#comment-dialog-2').dialog('close');
            }
            else
            {
                $.messager.alert('信息提示','提交失败！','info');
            }
        })
    }
    /**
    * Name 修改记录
    */
    function editUser(id){
        $("#comment-form-2").form("clear");
        $('#comment-dialog-2').dialog({
            closed: false,
            modal:true,
            title: "修改信息",
            buttons: [{
                text: '确定',
                iconCls: 'icon-ok',
                handler: userAddAction
            }, {
                text: '取消',
                iconCls: 'icon-cancel',
                handler: function () {
                    $('#comment-dialog-2').dialog('close');
                }
            }]
        });
        $.ajax({
            type:"post",
            url:"http://localhost:3000/comment/all"
        }).then(function(res){
            for(var i=0;i<res.length;i++){
                if(res[i]._id==id){
                    $(".wu-text0").val(res[i].name);
                    $(".wu-text1").val(res[i].thump);
                    $(".wu-text2").val(res[i].content);
                }
            }
        })
    }
    function userAddAction(id){
        var node = $('#comment-datagrid-2').datagrid('getSelected');
        var id=node._id;
        var postUrl;
        var formData = $('#comment-form-2').serializeJSON();
        var id1=$.parseUrl(window.location.href).query.id;//获取新闻页面传过来的id
        formData.newsId=id1;
        $.ajax({
            type:"post",
            url:"http://localhost:3000/comment/data/"+id,
            data: formData
        }).then(function(res){
            load();
            $('#comment-dialog-2').dialog('close');
        })
    }

    function openEdit(){
        var item = $('#comment-datagrid-2').datagrid('getSelections');
        if(item.length>1){
            alert('不能同时修改多个');
        }else{
            $("#comment-form-2").form("clear");
            $('#comment-dialog-2').dialog({
                closed: false,
                modal:true,
                title: "修改信息",
                buttons: [{
                    text: '确定',
                    iconCls: 'icon-ok',
                    handler: userAddAction
                }, {
                    text: '取消',
                    iconCls: 'icon-cancel',
                    handler: function () {
                        $('#comment-dialog-2').dialog('close');
                    }
                }]
            });
            var node = $('#comment-datagrid-2').datagrid('getSelected');
            var id=node._id;
            $.ajax({
                type:"post",
                url:"http://localhost:3000/comment/data/"+id
            }).then(function(res){
                $(".wu-text0").val(node.name);
                $(".wu-text1").val(node.thump);
                $(".wu-text2").val(node.content);
            })
        }
    }
    function userAddAction(id){
        var id1=$.parseUrl(window.location.href).query.id;
        var node = $('#comment-datagrid-2').datagrid('getSelected');
        var id=node._id;
        var postUrl;
        if($(".wu-text").val()){
            $(".wu-text0").val(node.name);
            $(".wu-text1").val(node.thump);
            $(".wu-text2").val(node.content);
        }else{
            $(".wu-text0").val();
            $(".wu-text1").val();
            $(".wu-text2").val();
        }
        var formData = $('#comment-form-2').serializeJSON();
        formData.newsId=id1;
        $.ajax({
            type:"post",
            url:"http://localhost:3000/comment/data/"+id,
            data: formData
        }).then(function(res){
            load();
            $('#comment-dialog-2').dialog('close');
        })
    }
    
    /**
    * Name 删除记录
    */
    function remove(){
        $.messager.confirm('信息提示','确定要删除该记录？', function(result){
            if(result){
                var items = $('#comment-datagrid-2').datagrid('getSelected');
                if(items){
                    var node = $('#comment-datagrid-2').datagrid('getSelected');
                    var id=node._id;
                    $.ajax({
                        type:"delete",
                        url:"http://localhost:3000/comment/data/"+ id
                    }).then(function(res){
                        if(res){
                            $.messager.alert('信息提示','删除成功！','info');
                            load();
                        }else{
                            $.messager.alert('信息提示','删除失败！','info');
                        }
                    });
                }else{
                    $.messager.alert('信息提示','请选中删除项！','info');
                }
            }
        });
    }


    function deleUser(id){
        $.ajax({
            type:"delete",
            url:"http://localhost:3000/comment/data/"+ id
        }).then(function(res){
            load();
        });
    }


    /*刷新*/
    function reload(){
        load();
    }

    /**
    * Name 分页过滤器
    */
    function pagerFilter(data){
        if (typeof data.length == 'number' && typeof data.splice == 'function'){// is array
            data = {
                total: data.length,
                rows: data
            }
        }
        var dg = $(this);
        var opts = dg.datagrid('options');
        var pager = dg.datagrid('getPager');
        pager.pagination({
            onSelectPage:function(pageNum, pageSize){
                opts.pageNumber = pageNum;
                opts.pageSize = pageSize;
                pager.pagination('refresh',{pageNumber:pageNum,pageSize:pageSize});
                dg.datagrid('loadData',data);
            }
        });
        if (!data.originalRows){
            data.originalRows = (data.rows);
        }
        var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
        var end = start + parseInt(opts.pageSize);
        data.rows = (data.originalRows.slice(start, end));
        return data;
    }
</script>
</body>
</html>